.content {
		font-family: PingFang SC;
		width: 100;
		height: auto;
		background-color: #F4F4F4;
		overflow: hidden;
		padding-bottom: 100upx;

		.searchBox {
			display: flex;
			align-items: center;
			width: 100%;
			height: 82upx;
			padding: 0px 32upx;
			background: #E38434;

			view {
				width: 15%;
				display: flex;
				align-items: center;

				img {
					display: block;
					width: 22upx;
					height: 29upx;
				}

				view {
					width: 80upx;
					font-size: 30upx;
					font-weight: 500;
					color: #FFF;
					margin-left: 18upx;
				}
			}

			.searchInput {
				position: relative;
				width: 100%;
				color: #B2B2B2;
				height: 50upx;
				background: #FFFFFF;
				border-radius: 25upx;
				font-size: 24upx;
				margin-left: 30upx;

				input {
					width: 100%;
					padding-left: 60upx;
					padding-right: 20upx;
					box-sizing: border-box;
				}

				img {
					display: block;
					width: 25upx;
					height: 26upx;
					position: absolute;
					left: 20upx;
				}
			}
		}

		.swiperBox {
			width: 100%;
			height: 341upx;
			background-image: url(../../static/images/swiper.png);
			background-position: center;
			background-repeat: no-repeat;
			background-size: 100% 100%;
			padding: 32upx 20upx;
			box-sizing: border-box;
			overflow: hidden;
		}

		.navList {
			width: 100%;
			height: auto;
			display: flex;
			flex-wrap: wrap;
			padding: 30upx;
			box-sizing: border-box;
			background-color: #FFFFFF;

			.navItem {
				width: 25%;

				img {
					display: block;
					width: 110upx;
					height: 110upx;
					margin: 0 auto;
				}

				view {
					text-align: center;
					font-size: 28upx;
					color: #1D1D1D;
				}
			}
		}

		.lamp {
			margin-top: 16upx;
		}

		.recommend {
			width: 100%;
			margin-top: 16upx;
			background-color: #FFFFFF;
			padding: 30upx;
			box-sizing: border-box;

			.recommendTit {
				width: 100%;
				display: flex;
				justify-content: space-between;
				align-items: center;

				img {
					display: block;
					width: 32upx;
					height: 32upx;
				}

				view:nth-child(1) {
					display: flex;
					align-items: center;

					text {
						margin-left: 10upx;
						font-weight: bold;
						color: #333333;
					}
				}

				view:nth-child(2) {
					display: flex;
					align-items: center;
					font-size: 24upx;

					text:nth-child(1) {
						color: #E38434;
						margin-right: 20upx;
					}

					text:nth-child(2) {
						display: block;
						width: 2upx;
						height: 20upx;
						background-color: #E38434;
					}

					text:nth-child(3) {
						margin-left: 20upx;
					}
				}
			}
			.likeList{
				width: 100%;
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				.likeListItem{
					position: relative;
					width: 328upx;
					height: 342upx;
					margin-top: 30upx;
				  box-shadow: 0px 3px 6px 0px rgba(37, 37, 37, 0.11);
			    border-radius: 0px 0px 10px 10px;
					padding-bottom: 20upx;
					overflow: hidden;
					.playBtn{
						position: absolute;
						z-index: 99;
						top: 77upx;
						left: 140upx;
						img{
							display: block;
							width: 47upx;
							height: 47upx;
						}
					}
					view{
						img{
							display: block;
							width: 100%;
							height: 200upx;
						}
						.likeTit{
							margin-top: 16upx;
							font-size: 28upx;
							font-weight: 500;
							color: #333333;
							padding-left: 10upx;
						}
						view{
							display: flex;
							justify-content: space-between;
							font-size: 24upx;
							margin-top: 30upx;
							padding: 0 10upx;
							box-sizing: border-box;
							text{
								font-size: 24upx;
								color: #676767;
							}
							view{
								display: flex;
								align-items: center;
							}
							view:nth-child(1) img{
								display: block;
								width: 30upx;
								height: 30upx;
							}
							view:nth-child(2) img{
								display: block;
								width: 24upx;
								height: 24upx;
							}
							text{
								margin: 0;
								padding-left: 10upx;
							}
						}
					}
				}
				.nextPage{
					width: 100%;
					height: 93upx;
					view{
						width: 140upx;
						display: flex;
						line-height: 93upx;
						align-items: center;
						margin: 0 auto;
						text-align: center;
					}
					img{
						display: block;
						width: 21upx;
						height: 21upx;
					}
					text{
						font-size: 24upx;
						color: #333333;
						margin-left: 20upx;
					}
				}
			}
		}
		.activity{
			margin-top: 16upx;
			width: 100%;
			height: auto;
			background-color: #FFFFFF;
			padding: 30upx;
			box-sizing: border-box;
			.activityNav{
				width: 100%;
				display: flex;
				align-items: center;
				view{
					width: 100%;
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-left: 8upx;
					font-size: 28upx;
					color: #676767;
				}
				.isActive{
					font-size: 30upx;
					font-weight: bold;
					color: #333333;
				}
				img{
					display: block;
					width: 32upx;
					height: 33upx;
				}
			}
			.activityList{
				width: 100%;
				.activityItem{
					display: flex;
					justify-content: space-between;
					align-items: center;
					width: 100%;
					height: 260upx;
					background: #F6F6F6;
					box-shadow: 0px 3px 9px 0px rgba(37, 37, 37, 0.2);
					border-radius: 10px;
					overflow: hidden;
					margin-top: 28upx;
					view:nth-child(1){
						width: 50%;
						height: 100%;
						img{
							display: block;
							width: 100%;
							height: 100%;
						}
					}
					view:nth-child(2){
						width: 50%;
						height: 100%;
						padding: 29upx 10upx 24upx 20upx;
						box-sizing: border-box;
						.tit{
							width: 100%;
							height: 64upx;
							line-height: 34upx;
							font-size: 28upx;
							color: #333333;
							font-weight: 500;
							display: -webkit-box;
							overflow: hidden;
							text-overflow: ellipsis;
							-webkit-line-clamp: 2;
							-webkit-box-orient: vertical;
						}
						.actyTime{
							width: 100%;
							height: 30upx;
							margin-top: 20upx;
							font-size: 24upx;
							color: #676767;
							line-height: 30upx;
							font-weight: 500;
							padding: 0;
						}
						.actyAddes{
							width: 100%;
							font-size: 24upx;
							color: #676767;
							line-height: 30upx;
							font-weight: 500;
							padding: 0;
							margin-top: 6upx;
						}
						.btn{
							width: 240upx;
							height: 48upx;
							background: #E38434;
							border-radius: 24upx;
							font-size: 28upx;
							font-weight: 500;
                            color: #FFFFFF;
                            line-height: 48upx;
							margin-top: 20upx;
						}
					}
				}
			}
			.lodingMore{
				width: 100%;
				margin-top: 40upx;
				view{
					width: 120upx;
					display: flex;
					align-items: center;
					font-size: 24upx;
					color: #333333;
					margin: 0 auto;
					text{
						margin-left: 20upx;
						
					}
				}
				img{
					display: block;
					width: 25upx;
					height: 16upx;
				}
			}
		}
		.broadcast{
			margin-top: 16upx;
			width: 100%;
			height: auto;
			background-color: #FFFFFF;
			padding: 30upx;
			box-sizing: border-box;
			.broadcastTit{
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-between;
				view:nth-child(1){
					display: flex;
					align-items: center;
					img{
						display: block;
						width: 32upx;
						height: 32upx;
					}
					.broadcastNavList{
						display: flex;
						justify-content: space-between;
						align-items: center;
						width: 168upx;
						font-size: 28upx;
						font-weight: 500;
						color: #676767;
						margin-left: 6upx;
						.isActive{
							font-size: 32upx;
							font-weight: bold;
							color: #333333;
						}
					}
				}
				view:nth-child(2){
					display: flex;
					align-items: center;
					text{
						font-size: 28upx;
						font-weight: 500;
						color: #676767;
						margin-right: 12upx;
					}
					img{
						display: block;
						width: 13upx;
						height: 23upx;
					}
				}
			}
			.broadcastList{
				width: 100%;
				height: auto;
				border-radius: 10px;
				margin-top: 30upx;
				
				.broadcastItem{
					position: relative;
					width: 100%;
					padding-bottom: 30upx;
					img{
						display: block;
						width: 100%;
						height: 338upx;
					}
					.playing{
						position: absolute;
						display: flex;
						align-items: center;
						justify-content: space-around;
						top: 20upx;
						right: 13upx;
						width: 128upx;
						height: 40upx;
						background: #E38434;
						border-radius: 10upx;
						padding: 6upx 10upx;
						box-sizing: border-box;
						img{
							display: block;
							width: 20upx;
							height: 25upx;
						}
						text{
							font-size: 24upx;
							font-weight: 500;
							color: #FFFFFF;
						}
					}
					.playBtn{
						width: 100%;
						height: 100%;
						position: absolute;
						left: 50%;
						top: 50%;
						margin-left: -46upx;
						margin-top: -46upx;
						z-index: 99;
						img{
							display: block;
							width: 93upx;
							height: 93upx;
						}
					}
					.broadcasTexplain{
						margin-top: 30upx;
						view:nth-child(1){
							font-size: 28upx;
							font-weight: 500;
							color: #333333;
						}
						view:nth-child(2){
							font-size: 24upx;
							font-weight: 500;
							color: #676767;
							margin-top: 20upx;
						}
					}
				}	
				
			}
		}
		.popularInstitutions{
			margin-top: 16upx;
			width: 100%;
			height: auto;
			background-color: #FFFFFF;
			padding: 30upx;
			box-sizing: border-box;
			.popularTit{
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-between;
				view:nth-child(1){
					display: flex;
					align-items: center;
					img{
						display: block;
						width: 32upx;
						height: 32upx;
					}
					text{
						font-size: 30upx;
						font-weight: bold;
						color: #333333;
						margin-left: 10upx;
					}
				}
				view:nth-child(2){
					display: flex;
					align-items: center;
					img{
						display: block;
						width: 13upx;
						height: 23upx;
					}
					text{
						font-size: 24upx;
						font-weight: 500;
						color: #676767;
						margin-right: 12upx;
					}
				}
			}
			.popularLust{
				margin-top: 30upx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				.popularItem{
					width: 210upx;
					img{
						display: block;
						width: 210upx;
						height: 180upx;
					}
					.popName{
						width: 100%;
						text-align: center;
						margin-top: 27upx;
						font-size: 24upx;
						font-weight: 500;
						color: #333333;
					}
					.fansNum{
						width: 100%;
						text-align: center;
						font-size: 24upx;
						font-weight: bold;
						margin-top: 16upx;
						color: #E38434;
						text{
							font-weight: 500;
							color: #676767;
							margin-left: 4upx;
						}
					}
					.btn{
						width: 160upx;
						height: 40upx;
						background: #E38434;
						border-radius: 20upx;
						line-height: 40upx;
						font-size: 28upx;
						font-weight: 500;
						color: #FFFFFF;
						margin: 0 auto;
						margin-top: 22upx;
					}
				}
			}
		}
	}